<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--src 资源路径
    1.相对路径：一般访问站内资源使用
      --图片和页面在同一目录：直接写图片名
      --图片在页面上一级目录：../图片名
      -图片在页面下一级目录：文件夹/图片名
    2.绝对路径：一般访问站外资源，图片盗链 有找不到图片的风险
        alt:图片不能正常显示时提示的文本
        title:图片标题 悬停的时候显示
-->
<img src="1图片.webp" alt="美女图1">
<img src="../2图片.webp" title="美女图2">
<!--两种赋值方式：1.像素 2.上级元素百分比
     只设置宽度时  高度会等比例-->
<img src="tupian/3图片.webp" width="50%">
<img src="tupian/3图片.webp" width="50" height="100">
<img src="tupian/3图片.webp">
<!--绝对路径-->
<img src="https://img2.baidu.com/it/u=2464622825,1961040651&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1678899600&t=4495a118070ffe9a0e71bd9dafbec391">



</body>
</html>